$DREADS = {}

// Operações iniciais
$DREADS.start = function(){
    
}

// Atualiza dados do personagem selecionado
$DREADS.atualizaPersonagem = function (){
    var personagemSelecionado = $("#Personagens :selected").val();
	
	$('#lista-cenas li.edit .span2 .pers').attr('src', 'https://graph.facebook.com/'+personagemSelecionado+'/picture');	
}


// Atualiza a fala
$DREADS.atualizaFala = function (){
    var fala = $('#lista-cenas li.edit .dialogo');
    fala.text($('#configfala').val());
    fala.css('margin-top', ((100 - fala.outerHeight())/2)+'px');
}

$DREADS.selecionaCor = function (e){
    $('#cenario').attr('style', $(e.currentTarget).attr('style'));
}

$DREADS.adicionaCena = function (){  
    var li = $('<li class="cena row-fluid">'+
                   '<div class="span2"><img src="img/personagem.png" class="pers"></div>'+
                   '<div class="span10 dialogo" style="margin-top: 30px;"></div>'+
                '</li>');
    $('#novacena').before(li);
    li.click($DREADS.selecionaCena);
    li.click();
}

$DREADS.selecionaCena = function (e){
    $('.cenavazia').show();
    $('.comcena').hide();
    $('#lista-cenas li').removeClass('edit');
    if (e!=null) {
        var li = $(e.currentTarget);
        li.addClass('edit');
        
		$('#configfala').val($('#lista-cenas li.edit .dialogo').text());
        $('.cenavazia').hide();
        $('.comcena').show();
        $('#myTab a[href="#tab2"]').tab('show');
        $('#configfala').focus();
    }
}

$(function (){
    // Funções de callback
    $('#novacena').click($DREADS.adicionaCena);
    
    // Iniciando a aplicação
    $DREADS.start();
});